<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>我的收藏</title>
    <link rel="stylesheet" href="./css/style.css">
    <link rel="stylesheet" href="./css/collection.css">
    <link rel="icon" type="image/x-icon" href="./images/logo.png" />
    <link rel="stylesheet" href="./css/bootstrap.css">
    <link rel="stylesheet" href="./css/bootstrapcss.css">
</head>

<body>


    <nav class="navbar navbar-default navbar-fixed-top ">
        <div class="container ">
            <!-- 大屏导航栏 -->
            <div class="navbar-header ">
                <a href="index.html" class="navbar-brand"><img src="./images/logoindex.png" alt="" class="logoimage"></a>
                <button class="navbar-toggle " data-toggle="collapse" data-target=".navbar-collapse ">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
            </div>
            <!--小屏幕导航以及Logo-->
            <!--导航-->

            <div class="navbar-collapse collapse">
                <ul class="nav navbar-nav navbar-right">
                    <!--navbar-right 向右对齐导航栏中的组件。-->
                    <li><a href="index.html?#home" target="_self">推荐</a></li>
                    <li><a href="index.html?#bbs" target="_self">高分电影</a></li>
                    <li><a href="index.html?#people" target="_self">电视剧</a></li>
                    <li><a href="index.html?#course" target="_self">最新电影</a></li>
                    <li><a href="index.html?#contact" target="_self">网站留言</a></li>
                    <li><a href="./Collection.html" target="_self">收藏</a></li>
                    <li><a href="./myself.html" target="_blank">个人中心</a></li>
                </ul>
            </div>
            <!--导航-->
        </div>
    </nav>


    <div class="container">
        <div class="row top top1">
            <div class="col-md-3">
                <div class="course" align="center">
                    <!--让图片与按钮居中-->
                    <img src="./images/铁雨.jpg" class="img-responsive" alt="">
                    <a href="https://www.bilibili.com/video/BV19D4y1X79f" class="btn btn-primary" target="_blank" role="button">
                        铁雨
                    </a>
                    <a href="#" class="btn btn-primary" target="_blank" role="button">
                        取消收藏
                    </a>
                </div>
            </div>
            <div class="col-md-3">
                <div class="course" align="center">
                    <img src="images/我不是药神.jpg" class="img-responsive" alt="">
                    <a href="https://www.bilibili.com/video/BV1ea4y1W7kF" class="btn btn-primary" target="_blank" role="button">
                        我不是药神
                        </a>
                    <a href="#" class="btn btn-primary" target="_blank" role="button">
                                取消收藏
                            </a>
                </div>
            </div>
            <div class="col-md-3">
                <div class="course" align="center">
                    <img src="images/孟买酒店.jpg" class="img-responsive" alt="">
                    <a href="https://neets.cc/detail/B8AJtV6ctxTTvTkTA2APNo" class="btn btn-primary" target="_blank" role="button">
                            孟买酒店
                        </a>
                    <a href="#" class="btn btn-primary" target="_blank" role="button">
                                取消收藏
                            </a>
                </div>
            </div>
            <div class="col-md-3">
                <div class="course" align="center">
                    <img src="images/头文字d.jpg" class="img-responsive" alt="">
                    <a href="https://www.bilibili.com/video/BV1Yt411B7S6" class="btn btn-primary" target="_blank" role="button">
                            头文字D
                        </a>
                    <a href="#" class="btn btn-primary" target="_blank" role="button">
                                取消收藏
                            </a>
                </div>
            </div>
        </div>
        <div class="row top top2">
            <div class="col-md-3">
                <div class="course" align="center">
                    <img src="images/釜山行.jpeg" class="img-responsive" alt="">
                    <a href="https://www.bilibili.com/video/BV1zy4y167cX" class="btn btn-primary" target="_blank" role="button">
                        釜山行
                        </a>
                    <a href="#" class="btn btn-primary" target="_blank" role="button">
                                取消收藏
                            </a>
                </div>
            </div>
            <div class="col-md-3">
                <div class="course" align="center">
                    <img src="images/紧急救援.jpeg" class="img-responsive" alt="">
                    <a href="https://www.bilibili.com/video/BV13t4y1k7q9" class="btn btn-primary" target="_blank" role="button">
                        紧急救援
                        </a>
                    <a href="#" class="btn btn-primary" target="_blank" role="button">
                                取消收藏
                            </a>
                </div>
            </div>
            <div class="col-md-3">
                <div class="course" align="center">
                    <img src="images/少年.jpg" class="img-responsive" alt="">
                    <a href="https://www.bilibili.com/video/BV1sV411h7Yz" class="btn btn-primary" target="_blank" role="button">
                            少年
                        </a>
                    <a href="#" class="btn btn-primary" target="_blank" role="button">
                                取消收藏
                            </a>
                </div>
            </div>
            <div class="col-md-3">
                <div class="course" align="center">
                    <img src="images/我的特工爷爷.jpg" class="img-responsive" alt="">
                    <a href="https://live.bilibili.com/4766933" class="btn btn-primary" target="_blank" role="button">
                            我的特工爷爷
                        </a>
                    <a href="#" class="btn btn-primary" target="_blank" role="button">
                                取消收藏
                            </a>
                </div>
            </div>
        </div>


        <div class="page">
            <ul class="pagination">
                <li><a href="#">&laquo;</a></li>
                <li><a href="#">1</a></li>
                <li><a href="#">2</a></li>
                <li><a href="#">3</a></li>
                <li><a href="#">4</a></li>
                <li><a href="#">5</a></li>
                <li><a href="#">&raquo;</a></li>
            </ul>
        </div>





</body>

</html>